<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JS023-页面加载事件</title>
    <!-- head里面写script，会在body加载之前执行 -->
    <script>
        //所有资源加载完毕时调用
        window.addEventListener('load', function () {
            const clickMeBtn = document.querySelector('button.click-me')
            clickMeBtn.addEventListener('click', function () {
                console.log('oh my gosh!');
            })
        })
    </script>
</head>
<style>
    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    body {
        background-color: #222;
        color: snow;
    }

    button.click-me {
        margin: 1rem;
        padding: 1rem 2rem;
        font-size: 1.25rem;
    }
</style>

<body>
    <button class="click-me">Click me</button>
</body>

</html>